<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>公告信息</title>
    <!--浏览器小图标-->
    <link rel="shortcut icon" href="/img/favicon.png">
    <!--自定义样式-->
    <link rel="stylesheet" href="/css/index.css">
    <!-- 引入Element UI样式 -->
    <link rel="stylesheet" href="/element/element-ui.css">
</head>
<body>
<div>
    <el-container>
        <!--自定义标签-->
        <el-header style="position: fixed;width: 100%;z-index: 1">
            <index-header></index-header>
        </el-header>
        <el-main>
            <el-row>
                <el-col offset="2" span="20">
                    <el-row style="margin-top: 55px">
                        <el-col span="4">
                            <index-left-card></index-left-card>
                        </el-col>
                        <el-col span="20" v-loading="loading">
                            <!--页面内容-->
                            <!--右边卡片-->
                            <el-card shadow="hover">
                                <el-row>
                                    <el-col span="4">
                                        <el-card>
                                            <div class="block">
                                                <el-timeline >
                                                    <el-timeline-item
                                                            v-for="(activity, index) in activities"
                                                            :key="index"
                                                            :icon="activity.icon"
                                                            :type="activity.type"
                                                            :color="activity.color"
                                                            :size="activity.size"
                                                            :timestamp="activity.timestamp">

                                                        <el-link @click.native="getPage(index)">{{activity.content}}</el-link>
                                                    </el-timeline-item>
                                                </el-timeline>
                                            </div>
                                        </el-card>
                                    </el-col>
                                    <el-col span="18" offset="2">

                                        <h1 style="text-align:center;"  v-html="context.title"></h1>
                                        <p v-html="context.content"></p>

                                    </el-col>
                                </el-row>


                            </el-card>
                        </el-col>
                    </el-row>
                </el-col>
            </el-row>
        </el-main>
        <!--自定义标签-->
        <el-footer>
            <index-footer></index-footer>
        </el-footer>
    </el-container>
</div>
</body>
<!-- 引入Vue和Element UI库 -->
<script src="/js/vue.js"></script>
<script src="/element/element-ui.js"></script>
<!--引入axios框架文件-->
<script src="/js/axios.js"></script>
<!--引入自定义header-->
<script src="/js/index-header.js"></script>
<!--引入自定义footer-->
<script src="/js/index-footer.js"></script>
<!--引入自定义卡片card-->
<script src="/js/index-left-card.js"></script>
<script>
    let v = new Vue({
        el: "body>div",
        data: function () {
            return {
                context:{
                    title: '',
                    content: '',
                },
                activities: [{
                    content: '医院详情',
                    timestamp: '2023-06-12 15:30',
                    size: 'large',
                    type: 'primary',
                    icon: 'el-icon-more'
                }, {
                    content: '医院须知',
                    timestamp: '2023-06-03 20:46',
                    color: 'rgb(11,189,35)'
                }, ],
                /*加载f*/
                loading:false,
            }
        },
        methods: {
            getPage(index){
                console.log(index)
                if(index===0){
                    this.getDetail();
                }
                if(index===1){
                    this.getNecessary()


                }
            },
            getDetail(){
                axios.get("/pa/notice/selectOne").then(function (response) {
                    console.log(response)
                    if (response.data.code === 1) {
                        v.context.content = response.data.data[0].title
                        v.context.title = response.data.data[0].notice;
                    } else {
                        v.$message.error("数据为空");
                    }
                })
            },
            getNecessary(){
                axios.get("/pa/notice/selectTwo").then(function (response) {
                    console.log(response)
                    if (response.data.code === 1) {
                        v.context.content = response.data.data[0].title
                        v.context.title = response.data.data[0].notice;
                    } else {
                        v.$message.error("数据为空");
                    }
                })
            }
        },
        created() {
        },
        mounted() {
            this.getDetail();
            this.getNecessary();

        },
        watch() {

        }
    })
</script>
</html>